<template xmlns="">
    <div style=" width: 80%; margin: 0 auto;height: 700px;position: relative" >
        <!--        左侧菜单栏-->
        <div >
            <el-menu
                background-color="#ECFFFF"
                style="width: 200px; height: 600px; position: absolute; top: 35px; "
                text-color="#000000"
                active-text-color="#00DB00"
                router
                :default-openeds="['1', '2', '3','4']"

            >
                <el-sub-menu index="1">
                    <template #title>
                        <span>个人中心</span>
                    </template>
                    <el-menu-item index="zhanghao" class="el-menu-item">账号资料</el-menu-item>
                </el-sub-menu>
                <el-sub-menu index="2">
                    <template #title>
                        <span>订单中心</span>
                    </template>
                    <el-menu-item index="dingdan" class="el-menu-item">我的订单</el-menu-item>
                </el-sub-menu>
                <el-sub-menu index="3">
                    <template #title>
                        <span>其他功能</span>
                    </template>
                    <el-menu-item index="shouhuo" class="el-menu-item">收货地址</el-menu-item>
                    <el-menu-item index="kefu" class="el-menu-item">联系客服</el-menu-item>
                </el-sub-menu>
                <el-sub-menu index="4" v-if="user.level == '20'">
                    <template #title>
                        <span>我的店铺</span>
                    </template>
                    <el-menu-item index="dingdan2" class="el-menu-item">店铺订单</el-menu-item>
                    <el-menu-item index="dianpu" class="el-menu-item">店铺信息</el-menu-item>
                    <el-menu-item index="shangpin" class="el-menu-item">我的商品</el-menu-item>
                </el-sub-menu>
            </el-menu>
        </div>
        <!--        右侧内容-->
        <div style="position: absolute ;right: 25px;top: 35px">
            <el-card style="width: 1000px;;height: 600px;">
                <router-view></router-view>
            </el-card>
        </div>

    </div>
</template>
<script setup>
import {onMounted, ref} from "vue";
const user =ref({});
onMounted(()=>{
    user.value=getUser();
})
</script>

<style scoped>
.el-menu-item{
    font-size: 18px;
    font-family: 'Abril Fatface', cursive;
}
span{
    font-size: 25px;
    font-family: 'Abril Fatface', cursive;
}

</style>
